<template>
  <div class="home_container flex">
    <HomeAside v-model:current-route="currentRoute" v-model:navArr="navArr" @support="supportVisible = true" />
    <main class="flex-1 flex">
      <Header v-model:keyword="keyword" />
      <router-view></router-view>
    </main>
    <!-- 在线支持 -->
    <Support v-model:supportVisible="supportVisible" />
    <!-- 通知 -->
    <Teleport to="body">
      <Notice />
    </Teleport>
  </div>
</template>

<script setup lang="ts">
import { ref, provide } from 'vue';
import HomeAside from './homeaslide.vue';
import Header from '@/components/header/index.vue';
import Support from '@/components/support/index.vue';
import Notice from '@/components/notice/index.vue';
import { IHomeNav } from '@/types/home';

const showNotice = ref(false)
provide("showNotice", showNotice)

const navArr = ref<IHomeNav[]>([{
  iconName: "icon-yingyongzhongxin",
  navName: "仪表盘",
  routerName: "/dashboard",
  id: 1
}, {
  iconName: "icon-xiangmu2",
  navName: "项目",
  routerName: "/project",
  id: 2
}, {
  iconName: "icon-rili1",
  navName: "日历",
  routerName: "/calendar",
  id: 3
}, {
  iconName: "icon-feijiflight-fill",
  navName: "假期",
  routerName: "/test4",
  id: 4
},
{
  iconName: "icon-yuangong2",
  navName: "雇员",
  routerName: "/vacation",
  id: 5
},
{
  iconName: "icon-xiaoxi",
  navName: "消息",
  routerName: "/chat",
  id: 6
},
{
  iconName: "icon-wenjianjia",
  navName: "门户网站",
  routerName: "/test8",
  id: 7
}]);
const currentRoute = ref("/home/test")

const keyword = ref("")

const supportVisible = ref(false)



</script>

<style scoped lang="scss">
.home_container {
  gap: 30px;

  // overflow: hidden;
  >main {
    flex-direction: column;
    // margin-bottom: 10px;
  }
}
</style>